import React from 'react';
import {Button, Drawer, Form, Space} from "antd";

type Props = {
    ref?: React.MutableRefObject<any> | any;
    refresh: () => void;
}

const DialogRole: React.FC<Props> = React.forwardRef((_props, ref) => {
    //父组件刷新列表事件
    // const {refresh} = props

    const [form] = Form.useForm();
    const [openDrawer, setOpenDrawer] = React.useState<boolean>(false);
    const [row, setRow] = React.useState<Record<string, any>>({});

    const handleOpenDrawer = (indexOrigin: number, rowItem: Record<string, any> = {}) => {
        if (indexOrigin === 2 && Object.keys(rowItem).length) {
            setTimeout(() => {
                form.setFieldsValue({
                    ...rowItem
                })
            })
        }
        setRow({...rowItem, index: indexOrigin})
        setOpenDrawer(true);
    };
    const submit = async (_values: Record<string, any>) => {

    }
    const handleCloseDrawer = () => {
        setOpenDrawer(false);
    };

    React.useImperativeHandle(ref, () => ({
        handleOpenDrawer
    }))
    return (
        <>
            <Drawer title={row.index === 1 ? '新增角色' : '编辑角色'} size="large" onClose={handleCloseDrawer}
                    open={openDrawer} styles={{body: {padding: '20px'}}} extra={
                <Space>
                    <Button onClick={handleCloseDrawer}>取消</Button>
                    <Button onClick={submit} type="primary">提交</Button>
                </Space>
            }>
                <p>Some contents...</p>
                <p>Some contents...</p>
                <p>Some contents...</p>
            </Drawer>
        </>
    );
})

export default DialogRole;
